<script type="text/javascript">
	Yutil.en.enhance();
</script>

<%
	List pdtList = new ArrayList();
	SimpleDateFormat sdf = new SimpleDateFormat( "yyyy-MM-dd" );
	Product p = new Product();
	p.setAmount(53);
	p.setName("Bread");
	p.setPrice(5.7f);
	p.setProducingArea("Nanjing");
	p.setPurchaseDate(sdf.parse( "2008-12-03" ) );
	p.setPurchaseDateInMMdd("12/03");
	p.setPurchaseDateInStr("Dec 3rd 2008");
	pdtList.add(p);
	
	p = new Product();
	p.setAmount(20);
	p.setName("Car");
	p.setPrice(100000.34f);
	p.setProducingArea("Shanghai");
	p.setPurchaseDate(sdf.parse( "2008-07-24" ) );
	p.setPurchaseDateInMMdd("07/24");
	p.setPurchaseDateInStr("Jul 24th 2008");
	pdtList.add(p);
	
	p = new Product();
	p.setAmount(259);
	p.setName("Cup");
	p.setPrice(20.7f);
	p.setProducingArea("Beijing");
	p.setPurchaseDate(sdf.parse( "2008-05-15" ) );
	p.setPurchaseDateInMMdd("05/15");
	p.setPurchaseDateInStr("May 15th 2008");
	pdtList.add(p);
%>

<div style = "font-size: 10pt;">
	<ul>
		<li>
			The checkbox column contains no enhancement. It is not sortable or dragable.
		</li>
		<li>
			The "Name" column can be sorted by alphabetical order. 
		</li>
		<li>
			The "Price" column and "Amount" column both show sorting by "more and less" order.
		</li>
		<li>
			The "Publish date" column shows how date column is sorted.
		</li>
		<li>
			The "Producing area" column shows how to sort with user defined order. Here Nanjing takes precedence over Shanghai, so is Shanghai over Beijing.
		</li>
		<li>
			When sorting date, it's not necessary a date be in "yyyy-MM-dd" format. The following formats are also allowed: mm/dd/yyyy, mm/dd, mm-dd, 4th Jan, 4th Jan 2003, Jan 4th 2003, Monday.
		</li>
	</ul>
</div>

<br />
<hr />
<br />


<table class = "grid" style = "font-size: 10pt;">
	<thead>
		<tr>
			<th></th>
			<th>Name</th>
			<th>Amount</th>
			<th>Price</th>
			<th>Purchase date</th>
			<th>Purchase date</th>
			<th>Purchase date</th>
			<th>Producing area</th>
		</tr>
	</thead>

	<tbody>
<%
	for ( int i = 0; i < pdtList.size(); i++ ){
		p = (Product) pdtList.get( i );
%>
		<tr>
			<td>
				<input type = "checkbox" class = "no_en no_sort" />
			</td>
			<td class = "number">
				<span><%= p.getName() %></span>
			</td>
			<td>
				<span><%= p.getAmount() %></span>
			</td>
			<td>
				<span><%= p.getPrice() %></span>
			</td>
			<td class = "date">
				<span><%= sdf.format( p.getPurchaseDate() ) %></span>
			</td>
			<td class = "date">
				<span><%= p.getPurchaseDateInMMdd() %></span>
			</td>
			<td class = "date">
				<span><%= p.getPurchaseDateInStr() %></span>
			</td>
			<td sortvalue = "<%= i %>">
				<span><%= p.getProducingArea() %></span>
			</td>
		</tr>
<%
	}
%>
	</tbody>
</table>

<%@ page contentType="text/html;charset=UTF-8" buffer="none" %>
<%@ page import = "nju.*" %>
<%@ page import = "java.util.*" %>
<%@ page import = "java.text.*" %>
